@import '~styles/config.scss';



.list {
    .ul {
        display              : grid;
        grid-gap             : 20px;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }
    .li {
        border-radius: 10px;
        background   : $--background-color-base;
        transition   : all .5s;
        cursor       : pointer;
        overflow     : hidden;
        &:hover {
            box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
        }
    }

    .text {
        position: relative;
        padding : 40px 0px 20px 0px;
    }

    .face {
        margin       : 0px auto;
        width        : 60px;
        height       : 60px;
        border-radius: 100%;
        overflow     : hidden;
        img {
            display   : block;
            width     : 100%;
            height    : 100%;
            object-fit: cover;
        }
    }

    .name {
        padding-top: 20px;
        text-align : center;
        font-size  : 18px;
        font-weight: bold;
        line-height: 30px;
    }

    .buts {
        padding-top: 20px;
        width      : 100%;
        text-align : center;
    }

    .time {
        background   : #fff;
        color        : #777;
        box-shadow   : 0px -0.5px 0.5px rgba(0, 0, 0, 0.05);
        // border-top:1px solid $--border-color-extra-light;
        padding      : 14px 0px;
        text-align   : center;
        font-size    : 12px;
    }
}